<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="commons/template_head::head('depositPM')">

</head>
<body>

<!-- begin::preloader-->
<div th:replace="commons/layout::preloader">

</div>
<!-- end::preloader -->

<!-- begin::navigation -->
<div th:replace="commons/layout::navigation">

</div>
<!-- end::navigation -->

<!-- begin::main -->
<div id="main">

    <!-- begin::header -->
    <div th:replace="commons/layout::main_header">

    </div>
    <!-- end::header -->

    <!-- begin::main-content -->
    <div class="main-content bg-info-bright" style="background-color: #e0ffff!important;">

        <!-- begin::container -->
        <div class="container">

            <div class="row rounded bg-white">
                <div class="col"></div>
                <div class="col text-center">
                    <h4 class="mt-4">付款账户    1234*****2374</h4>
                    <form class="needs-validation" novalidate>
                        <div class="row">
                            <div class="col-12">
                                <label for="username" class="form-label">其他付款账号</label>
                                <div class="input-group has-validation">
                                    <input type="text" class="form-control" id="username" placeholder="选填" required>
                                </div>
                            </div>

                            <div class="col-12 mt-2">
                                <label for="country" class="form-label">存期</label>
                                <select class="form-select" id="country" required>
                                    <option value="">三个月</option>
                                    <option>六个月</option>
                                    <option>一年</option>
                                    <option>两年</option>
                                    <option>三年</option>
                                    <option>五年</option>
                                </select>
                                <div class="invalid-feedback">
                                    请选择你的存期！
                                </div>
                            </div>

                            <div class="col-12 mt-2">
                                <label for="state" class="form-label">交易类型</label>
                                <select class="form-select" id="state" required>
                                    <option value="">开户</option>
                                    <option>缓存</option>
                                </select>
                                <div class="invalid-feedback">
                                    请选择交易类型！
                                </div>
                            </div>

                            <div class="col-12 mt-2">
                                <label for="state1" class="form-label">收款账号</label>
                                <select class="form-select" id="state1" required>
                                    <option value="">本卡</option>
                                    <option>其他卡</option>
                                </select>
                                <div class="invalid-feedback">
                                    请选择收款账号！
                                </div>
                            </div>

                            <div class="col-12">
                                <label for="cc-number" class="form-label">买入金额</label>
                                <input type="text" class="form-control" id="cc-number" placeholder="￥" required>
                                <div class="invalid-feedback">
                                    金额不能为空！
                                </div>
                            </div>
                            <div class="row">
                                <div class="form-check mt-2">
                                    <input type="checkbox" class="form-check-input" id="same-address">
                                    <label class="form-check-label" for="same-address">请同意购买规则，并认真阅读购买相关细则。</label>
                                </div>
                                <div class="btn-group w-100 btn btn-primary btn-lg mb-4 mt-2" role="group" type="submit">
                                    <button type="button" class="btn btn-primary"></button>
                                    <button type="button" class="btn btn-primary"><a href="#modal" class="stretched-link" data-toggle="modal">立即缴费</a></button>
                                    <button type="button" class="btn btn-primary"></button>
                                </div>

                                <div class="modal fade" id="modal">
                                    <div class="modal-dialog modal-lg">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <h3 class="modal-title text-center">申请成功提示</h3>
                                                <span class="close" data-dismiss="modal">&times;</span>
                                            </div>
                                            <div class="modal-body">
                                                <p>
                                                    您已申请本信用卡成功！请您注意查收信息。祝您生活愉快！
                                                </p>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="col"></div>
            </div>

            <div class="row bg-white text-center rounded mt-3">
            <h2 class="mb-2 mt-3">存款产品利率表</h2>
                <div class="col-lg-12">
            <div class="table-responsive">
                <table class="table table-striped">
                    <thead>
                    <tr>
                        <th scope="col">存期</th>
                        <th scope="col">起存金额</th>
                        <th scope="col">挂牌年利率</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>三个月</td>
                        <td>50元</td>
                        <td>1.45%</td>
                    </tr>
                    <tr>
                        <td>六个月</td>
                        <td>50元</td>
                        <td>1.75%</td>
                    </tr>
                    <tr>
                        <td>一年</td>
                        <td>50元</td>
                        <td>1.95%</td>

                    </tr>
                    <tr>
                        <td>两年</td>
                        <td>50元</td>
                        <td>2.45%</td>
                    </tr>
                    <tr>
                        <td>三年</td>
                        <td>50元</td>
                        <td>2.95%</td>
                    </tr>
                    <tr>
                        <td>五年</td>
                        <td>50元</td>
                        <td>3.15%</td>
                    </tr>
                    </tbody>
                </table>
            </div>
                </div>
            </div>
            <div class="row align-items-md-stretch text-center mt-4">
                <div class="col-lg-6">
                    <div class="h-100 p-5 text-white bg-dark rounded-3">
                        <h2>产品细则</h2>
                        <ul class="list-unstyled mt-4 mb-4">
                            <li>|一最低持有730天—|</li>
                            <li>每天09:00-15:00提出申购申请，份额于T+2日(工作日，遇非工作曰顺延至下一工作日)进行确认。</li>
                            <li>申购资金T日(工作日,遇非工作日顺延至下一工作日)扣划。</li>
                        </ul>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="h-100 p-5 bg-white border rounded-3">
                        <h2>交易规则</h2>
                        <ul class="list-unstyled mt-4 mb-4">
                            <li>购买规则:每个产品工作日的9:00至15:00可申购</li>
                            <li>赎回规则:持有满730天。每个工作日9点至赎回开放日当日15点可赎回</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <!-- end::container -->

    </div>
    <!-- end::main-content -->

    <!-- begin::footer -->
    <footer th:replace="commons/layout::main_footer">

    </footer>
    <!-- end::footer -->

</div>
<!-- end::main -->

<div th:replace="commons/layout::end">

</div>

</body>
</html>


